<!DOCTYPE html>
<html>

<head>
    <title>北京站网格化系统</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Fonts -->
    <!-- CSS Libs -->
    <link rel="stylesheet" type="text/css" href="../lib/css/NGR.css">
    <script type="text/javascript" src="../lib/js/jquery.min.js"></script>
    <script type="text/javascript" src="../lib/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../lib/js/Chart.min.js"></script>
    <script type="text/javascript" src="../lib/js/bootstrap-switch.min.js"></script>
    <script type="text/javascript" src="../lib/js/jquery.matchHeight-min.js"></script>
    <script type="text/javascript" src="../lib/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="../lib/js/dataTables.bootstrap.min.js"></script>
    
    <script type="text/javascript" src="../lib/js/select2.full.min.js"></script>
    <script type="text/javascript" src="../lib/js/validform.js"></script>
    <script type="text/javascript" src="../lib/js/ace/ace.js"></script>
    <script type="text/javascript" src="../lib/js/ace/mode-html.js"></script>
    <script type="text/javascript" src="../lib/js/ace/theme-github.js"></script>
    <!-- Javascript -->
    <script type="text/javascript" src="../lib/js/common/app.js"></script>
    <!-- <script type="text/javascript" src="../lib/js/common/index.js"></script> -->
    <!-- Javascript -->
    <script src="../lib/js/vue.js"></script>
    <script type="text/javascript" src="../lib/js/datetimepicker.js"></script>
    <script type="text/javascript" src="../lib/js/dataTables.select.min.js"></script>
    <script src="../lib/js/jquery-treegrid-master/jquery.treegrid.min.js"></script>
    <script src="../lib/js/jquery-treegrid-master/jquery.treegrid.bootstrap3.js"></script>
    <script src="../lib/js/jquery-treegrid-master/jquery.treegrid.extension.js"></script>
    <!-- <script type="text/javascript" src="../lib/js/depchoice/edep_plugin.js"></script> -->
    <!-- <script src="../lib/js/ztreeJs.js" type="text/javascript"></script> -->
    <script src="../lib/js/NGR.min.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="map" style="width:1000px;height:600px"></div>
    </body>
    <script>
    window.map = new NGR.View('map', {
        appKey: "73f05e8ba965437e8b58397259280e0a",
        minZoom:19,
        scrollWheelZoom:"center"
    });
    window.res = new NGR.DataSource({
        appKey: "73f05e8ba965437e8b58397259280e0a"
    });
    var control = NGR.control.floor();
    window.layers = {}
    res.requestMaps().then(function (maps) {
        res.requestPOIChildren(maps.list[0].poi).then(function (floors) {
            //取到该地图所有楼层的id数据
            // for (var i = 0; i < floors.length; i++) {
            //     _floorId.push(floors[i].id)
            // }
            map.addControl(control);
            control.on('change', function (e) {
                control.setCurrentFloor(e.to, loadPlanarGraph);
            });
            control.setFloorList(floors);
            control.setCurrentFloor(floors[3].id, loadPlanarGraph);
            loadPlanarGraph(floors[1].id)

        }).fail(function (e) {
            return console.error(e, e.stack);
        });
    }).fail(function (e) {
        return console.error(e, e.stack);
    });

    //渲染地图图层
    window.loadPlanarGraph = function (planarGraphId) {
        return res.requestPlanarGraph(planarGraphId).then(function (layerInfo) {
            // console.log(layerInfo);
            var lastLayer = null;
            map.clear()
            return NGR.IO.fetch({
                url: '../lib/json/style.json',
                onsuccess: JSON.parse
            }).then(function (style) {
                layers.frame = NGR.featureLayer(layerInfo, {
                    layerType: 'Frame',
                    styleConfig: style
                });
                layers.area = NGR.featureLayer(layerInfo, {
                    layerType: 'Area',
                    styleConfig: style
                });
                layers.annotation = NGR.featureLayer(layerInfo.Area, {
                    layerType: 'LogoLabel',
                    styleConfig: style
                });
                layers.facility = NGR.featureLayer(layerInfo.Facility, {
                    layerType: 'Facility',
                    styleConfig: style
                });

                layers.collision = NGR.layerGroup.collision({
                    margin: 3
                });
                layers.collision.addLayer(layers.annotation);
                layers.collision.addLayer(layers.facility);

                map.addLayer(layers.frame);
                map.addLayer(layers.area);
                map.addLayer(layers.collision);
                // if(isStation){
                //     getDataWorkStation()
                // }else{
                //     getBaseData();    
                // }
                myStyle=style
                map.render();
                if($('.ngr-bottom.ngr-right').length != 0){
                    $('.ngr-bottom.ngr-right').remove()
                }

            }).fail(function (e) {
                return console.error(e, e.stack);
            });
        }).fail(function (e) {
            return console.error(e, e.stack);
        });
    }
    </script>
    </html>